@import "assets/styles/styles";

.IconButton {
  // Position + size
  width: 30px;
  height: 30px;
  line-height: 1rem;
  display: inline-block;
  text-align: center;
  transition: 100ms all ease;

  // Style reset - bootstrap is adding unnecessary css
  outline: none !important;
  font-family: $primary-font;
  font-weight: bold;
  border: 2px solid $mid-gray;
  background: $light-gray;

  &:hover {
    background: $white;
  }

  &:focus,
  &:active {
    border-color: $black;
  }

  span {
    padding-left: 8px;
  }
}
